<style scoped>
    .expand-row {
        margin-bottom: 16px;
    }
    
    .expand-row li {
        display: flex;
        flex-direction: column;
    }
    
</style>
<style>
    .ivu-table-tbody .ivu-table-expanded-cell {
          padding-top:5px;
    }
    .expend{
        margin-bottom:5px;
    }
    .expend .ivu-table td, .ivu-table th {
          border-bottom:none;
          background:#f8f8f9;
    }
</style>
<template>

<div>
    <Table class="expend" size="small" :data="rowTableData" :columns="columns14"></Table>
    <ul class="expand-row" v-if="cases.length>0" v-for="item in cases">
        <li>
            <span class="expand-key">{{item.creatorName}}----{{item.createTime}} </span>
            <span class="expand-value">{{item.content}}</span>
        </li>
    </ul>
    <span v-if="cases.length==0">
       -----暂无小结--------
    </span>
</div>
</template>
<script>
    export default {
        props: {
            cases: Array,
            rowData:Object
        },
        mounted:function(){
           this.rowTableData.push(this.rowData)
        },
        data(){
            return{
                rowTableData:[],
                columns14: [ {
                    title: '主叫号码',
                    key: 'phoneNumber',
                    width:160
                }, {
                    title: '被叫号码',
                    key: 'dstTelNum',
                    width:160
                },
                    {
                    title: '服务时长',
                    key: 'totalTime',
                    align:'center'
                }, {
                    title: '来源渠道',
                    key: 'channelType',
                    align:'center'
                }, {
                    title: '工号',
                    key: 'agentID',
                    align:'center'
                }, {
                    title: '分机号',
                    key: 'extNumber',
                    align:'center'
                }, {
                    title: '是否接通',
                    align:'center',
                    key: 'pickupFlag',
                    render: (h, params) => {
                        if (params.row.pickupFlag) {
                            return '是'
                        } else {
                            return '否'
                        }
                    }
                }]
            }

        }

    };
</script>